<style>
</style>
<template>
    <ly-page>
        <ly-navi type="back" title="图片选择器"></ly-navi>
        <ly-page-content>
            <el-form  label-width="125px" size="small">
                <el-form-item label="单图" >
                    <ly-upload v-model="pic"  :limit="1"></ly-upload>
                </el-form-item>
                <el-form-item label="多图" >
                    <ly-upload  paste v-model="demoPics" :limit="9"></ly-upload>
                </el-form-item>
                <el-form-item label="剪贴板" >
                    <ly-upload  v-model="pic1"  :limit="1"></ly-upload>
                </el-form-item>
                <el-form-item label="多图剪贴板" >
                    <ly-upload   v-model="demoPics1" :limit="9"></ly-upload>
                </el-form-item>
                <el-form-item label="单文件">
                    <ly-upload v-model="file"  type="file" :limit="1"></ly-upload>
                </el-form-item>
                <el-form-item label="多文件" >
                    <ly-upload v-model="demoFiles"  type="file" :limit="9"></ly-upload>
                </el-form-item>

                <ly-code-view>
                    <pre v-pre>
<ly-upload v-model="demoPics"   action="上传地址默认通过 Ly.config 配置" :limit="9"></ly-upload>


//全局配置
  Ly.config({
        //uploadUrl:   "http://demo.bbsx.magcloud.net/user_center/open/v1/upload/thumb"//图片上传地址 配置了 uploadDataUrl uploadUrl
        uploadDataUrl: "https://job-job.duoyun6.com/oss/uploadInfo",//上传前的网络请求,获取的内容会用于上传
    });
      //   uploadDataUrl 网络请求返回结果如下
        {
            host: "http://static-job.magcloud.net", //图片上传地址
            data: {
                      ..... 用于文件网络请求参数
                }
            }
                    </pre>
                </ly-code-view>
            </el-form>
            <ly-markdown>
                <pre v-pre>
## `ly-upload`
------
#### 全局参数

| 属性名  |说明   | 类型|可选值|默认值|
| ------------ | ------------ |------------ |------------ |------------ |
|  uploadUrl | 全局上传地址	  |String |—	|—	|
|  uploadDataUrl | 上传前的网络请求,获取的内容会用于上传	  |String |	|	|
## `uploadDataUrl` 返回参数
对接 oss等三方 web 直传会用这个路径

| 属性名  |说明   | 类型|可选值|默认值|
| ------------ | ------------ |------------ |------------ |------------ |
|  host | 上传的路径	  |String |—	|—	|
|  data | 上传时需要的附加参数  |object |	|	|

#### Attributes

| 属性名  |说明   | 类型|可选值|默认值|
| ------------ | ------------ |------------ |------------ |------------ |
|  v-model | 绑定的对象	  |String,Array |—	|—	|
|  type | 类型	  |String |pic,file	|pic	|
|  paste | 支持剪贴板上传图片	  |boolean |—	|false	|
|  action | 上传的路径	|String |-|Ly.config({picUploadUrl:''} )全局配置|
|  limit | 准许上传数量	  |int |—	|1	|
|  accept | 允许上传的文件类型	  |- |—	|image/*; video/*	|
|  disabled | 禁用,只允许浏览	  |- |—	|—	|
|  width | 宽度	  |- |—	|—	|
|  height | 高度	  |- |—	|—	|
|  dir | 文件上传路径分类,配置了 uploadDataUrl有用	  |- |—	|—	|
                </pre>
            </ly-markdown>
        </ly-page-content>
    </ly-page>
</template>
<script>
    Rap.define("", [], function (store, data) {
        return {
            data: function () {
                return {
                    demoPics:[],
                    pic:null,
                    pic1:null,
                    file:null,
                    demoFiles:[],
                    demoPics1:[],
                }
            },
            created:function () {

            },
            methods: {

            }
        }
    })
</script>